<template>
    <div>
        <ol>
            <li v-for="news in newsList" :key="news.newsId">
                <!---跳转路由并携带params参数，to的字符串写法-->
                <!-- <router-link :to="`/home/news/flow/${news.newsId}/${news.newsName}`">{{news.newsName}}</router-link> -->
                 <!---跳转路由并携带params参数，to的对象写法 必须使用路由重命名-->
                <router-link :to="{
                    name:'pathveriable',
                    params:{
                        newsId:news.newsId,
                        newsName:news.newsName
                    }
                }">{{news.newsName}}</router-link>
            </li>
        </ol>
        <router-view></router-view>
    </div>
    
</template>

<script>
    export default {
        name:'News',
        data:function(){
            return {
                newsList:[
                    {newsId:'001',newsName:'newsFlow1'},
                    {newsId:'002',newsName:'newsFlow2'},
                    {newsId:'003',newsName:'newsFlow3'},
                ]
            }
        }
    }
</script>

<style>

</style>